<template>
	<div class="swiper-container">
	    <div class="swiper-wrapper">
	        <div class="swiper-slide" v-for="item in swiper"><img v-bind:src="item.imgsrc"></div>
	    </div>
	    <!-- 如果需要分页器 -->
	    <div class="swiper-pagination">
	    	<span class="swiper-pagination-bullet swiper-pagination-bullet-active"></span>
	    	<span class="swiper-pagination-bullet"></span>
	    	<span class="swiper-pagination-bullet"></span>
	    </div>
	</div>
</template>
<style type="text/css">
	.swiper-container,.swiper-slide{
		padding: 0;
		bottom: 0;
	}
	.swiper-slide img{
		width: 100%
	}
	.swiper-pagination-bullet-active{
		background: #ffd200;
	}
</style>
<script type="text/javascript">
	export default {
		data(){
			return{
				swiper:[
					{imgsrc:"http://img12.yiguoimg.com/e/ad/2017/170206/585749453189456454_800x322.jpg"},
					{imgsrc:"http://img13.yiguoimg.com/e/ad/2017/170213/585749453342515789_800x322.jpg"},
					{imgsrc:"http://img13.yiguoimg.com/e/ad/2017/170209/585749453266231881_800x322.jpg"}
				]
			}
		},
		mounted(){
			var swiper = new Swiper('.swiper-container', {
		        pagination: '.swiper-pagination',
		        slidesPerView:'auto',
		        paginationClickable: true,
		        loop : true,
		        autoplayDisableOnInteraction : false,
		        autoplay: 2500
	    	});
		}
	}
</script>
